<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@page import="CloudStorage.*" %>
<%
            int size = 0;
            if (session.getAttribute("cart") != null) {
                size = ((Cart) session.getAttribute("cart")).getSize();
            }
            User user = (User) session.getAttribute("user");
%>

<html>
    <head>
        <title>Cloud Share</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <link rel="stylesheet" type="text/css" href="style.css" />
        <link rel="stylesheet" type="text/css" href="buy_style.css" />
        <link rel="SHORTCUT ICON" href="images/favicon.ico" />

        <style type="text/css">
            <!--
            #main .inside .block1 {
                text-align: left;
                clear: none;
                float: left;
                margin-left: 250px;
                height: 200px;
            }

            a:link {
                color: #F6F1F0;
                text-decoration: none;
            }
            a:visited {
                text-decoration: none;
            }
            a:hover {
                text-decoration: none;
            }
            a:active {
                text-decoration: none;
            }

            body,td,th {
                color: #64584C;
            }
            -->
        </style>
    </head>

    <body>
        <div id="header">
            <div class="inside"> <a href="#" class="logo"><img src="images/logo2.gif" alt="" width="131" height="83" /></a>
                <p class="slogan">Share on Clouds!</p>
                <div id="cart">
                    <ul>
                        <li><a href="downloadcart.jsp"><img alt="cart" src="images/cart.png">  Download Cart (<%=size%>)</a> </li>
                    </ul>
                </div>
                <a href="faq.jsp" class="rss"><img src="images/rss.jpg" alt="" width="39" height="41" /></a>
            </div>
            <div id="menu">
                <% if (session.getAttribute("status") == null) {%>
                <ul>
                    <li><a href="index.jsp"><img src="images/but_home.jpg" alt="" width="148" height="40" /></a></li>
                    <li><a href="login.jsp"><img src="images/but_login.jpg" alt="" width="147" height="40" /></a></li>
                    <li><a href="register.jsp"><img src="images/but_reg.jpg" alt="" width="146" height="40" /></a></li>
                    <li><a href="downloads.jsp"><img src="images/but_down.jpg" alt="" width="146" height="40" /></a></li>
                    <li><a href="upload.jsp"><img src="images/but_upload.jpg" alt="" width="146" height="40" /></a></li>
                    <li><a href="buy.jsp"><img src="images/but_buy.jpg" alt="" width="146" height="40" /></a></li>

                </ul>
                <% } else {%>
                <ul>
                    <li><a href="index.jsp"><img src="images/but_home.jpg" alt="" width="148" height="40" /></a></li>
                    <li><a href="account.jsp"><img src="images/but_account.jpg" alt="" width="146" height="40" /></a></li>
                    <li><a href="downloads.jsp"><img src="images/but_down.jpg" alt="" width="146" height="40" /></a></li>
                    <li><a href="upload.jsp"><img src="images/but_upload.jpg" alt="" width="146" height="40" /></a></li>
                    <li><a href="buy.jsp"><img src="images/but_buy.jpg" alt="" width="146" height="40" /></a></li>
                    <li><a href="LogoutServlet"><img src="images/but_logout.jpg" alt="" width="147" height="40" /></a></li>
                </ul>
                <%}%>

            </div>
            <div class="headimage">
                <img src="images/picture.jpg" alt="" /> </div>
        </div>
        <div class="inside">
        </div>
        <div id="main">
            <%
                        if (session.getAttribute("status") != null) {
            %>
            <div class="inside">
                <div id="cpanel">
                    <h1><img src="images/cpanel.png" width="40" height="20">User panel</h1>
                    <ul>
                        <li></li>
                        <li><img src="images/myaccount-icon.png" width="20" height="20"> <a href="account.jsp">My Account</a></li>
                        <li><img src="images/uploads_icon.png" width="20" height="20" ><a href="myuploads.jsp"> My Uploads</a></li>
                        <li><img src="images/uploadicon.png"><a href="upload.jsp"> Upload File</a></li>
                        <li><img src="images/cart.png" width="20" height="20"><a href="downloadcart.jsp"> Download Cart</a></li>
                        <li><img src="images/buy_icon.png" alt="" width="20" height="20"><a href="buy.jsp">Buy more Space</a></li>
                        <li></li>
                    </ul>
                    <span><a href="LogoutServlet"> <img src="images/logout.png"/></a></span>
                </div>
                <div id="blocks">
                    <div class="left-buy"></div>
                    <div class="buy">

                        <h2>Buy more Space</h2>

                        <p>You currently have <%=(user.getAvailableSpace() / 1024 / 1024 / 1024)%> GB free Space to use!</p>

                        <div id="buy-img"><img src="images/buymore.png" width="90" height="120" ></div>
                        <table id="prices">
                            <tr id="first"><td >Range of Space</td>
                                <td>Price (&euro;/GB)</td>
                            </tr>
                            <tr><td >1-10 GB</td>
                                <td>15</td></tr>
                            <tr><td >11-100 GB</td>
                                <td>20</td></tr>
                            <tr><td>&gt;101 GB</td>
                                <td>25</td></tr>
                        </table>
                        <div id="buy-text">
                                <%if(session.getAttribute("final step") == null) {%>
                                <%if(session.getAttribute("success") != null){%>
                                <br/>
                                <p>Congratulations! You just bought the space you requested!</p>
                                <br/>
                                <%}%>
                                <form method="post" action="BuySpaceServlet?action=1">
				First Step:
                            <p>How much space do you need?
                                <input name="space" type="text" size="5">
				GB<br />
                            <p>
                                Select your method of payment:
                                <input name="method" type="radio" value="Paypal" checked>
				  Paypal
                                <input name="method" type="radio" value="Credit Card" unchecked>
				  Credit Card </p>
                                <table width="400" height="200">
                                    <tr><td>Credit Card Type</td>
                                        <td>
                                            <select name="card" id="select2">
                                                <option>Visa</option>
                                                <option>MasterCard</option>
                                                <option>American Express</option>
                                            </select>
                                        </td>
                                    </tr>
                                    <tr><td>Credit Card Number</td>
                                        <td>
                                            <input type="text" name="number" size="12">
                                        </td>
                                    </tr>
                                    <tr><td>CCV2</td>
                                        <td>
                                            <input type="text" size="5">
                                        </td>
                                    </tr>
                                </table>
                                <a href="BuySpaceServlet?action=0"> <img src="images/cancel.png" ></a>
                                <input type="image" src="images/continue.png" name="submit" >
                                </form>
                                <%}%>
                                <%if(session.getAttribute("final step") != null) {%>
                                <p>Final Step:<br />
                                    Review your purchase:<br />

                                <table width="400" height="200">
                                    <tr><td >Username</td>
                                        <td>
                                            <%=user.getUsername()%>
                                        </td>
                                    </tr>
                                    <tr><td>GB purchased</td>
                                        <td>
                                            <%= session.getAttribute("space")%> GB
                                        </td>
                                    </tr>

                                    <tr><td>Name</td>
                                        <td>
                                            <%=user.getName()%>
                                        </td>
                                    </tr>
                                    <tr><td >Surname</td>
                                        <td>
                                            <%=user.getSurname()%>
                                        </td>
                                    </tr>
                                    <tr><td>Credit Card Type</td>
                                        <td>
                                            <%=(String) session.getAttribute("card")%>
                                        </td>
                                    </tr>
                                    <tr><td>Credit Card Number</td>
                                        <td>
                                            <%=(String) session.getAttribute("number")%>
                                        </td>
                                    </tr>
                                    <tr><td>Total Charged</td>
                                        <td>
		                             <%=session.getAttribute("charge")%>      &#8364;
                                        </td></tr>

                                </table>
                                <a href="BuySpaceServlet?action=0"><img src="images/cancel.png" ></a>
                                <a href="BuySpaceServlet?action=2"> <img src="images/buy_sketo.png" ></a>
                                <%}%>
                            </div>
                        </div>
                    </div>
                    <div class="right-buy"></div>
                </div>
            </div>
            <%} else {%>
            <p>You must be logged in in order to see this page!</p>
            <%}%>
        <div id="footer">
            <div class="inside">
                <p>Cloud Share &copy; 2010   |  Webdesign by Panoylhs &amp; Roumdic S.A.</p>
            </div>
        </div>
    </body>
</html>
